<%@page language="java" isELIgnored="false" contentType="text/html"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix='fn' uri='http://java.sun.com/jsp/jstl/functions'%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<div class="searchform group">
	<form:form action="farm?action=search" commandName="animalsearch">
		<fieldset>
			<legend><a id="search-collapser" href="javascript:void(0)" title="Click To Expand">Search & Export</a></legend>
			<div id="search" class="group">
			<div  class="splitcontentleft tabular">
				<p class="tabular">
					<label>Type: </label>
					<form:select cssClass="uiDropdown" path="propertiesMap['type'].value">
						<form:option value=""></form:option>
						<form:options items="${type }" itemLabel="name" itemValue="id"/>
					</form:select>
				</p>
				<p class="tabular">
					<label>Health Status: </label>
					<form:select cssClass="uiDropdown" path="propertiesMap['healthstatus'].value">
						<form:option value=""></form:option>
						<form:options items="${healthStatus }" itemLabel="name" itemValue="id"/>
					</form:select>
				</p>
				<p class="tabular">
					<label>Color: </label>
					<form:select cssClass="uiDropdown" path="propertiesMap['color'].value">
						<form:option value=""></form:option>
						<form:options items="${colors }" itemLabel="name" itemValue="id"/>
					</form:select>
				</p>
				<p class="tabular">
					<label>Breed: </label>
					<form:select cssClass="uiDropdown" path="propertiesMap['breed'].value">
						<form:option value=""></form:option>
						<form:options items="${breeds }" itemLabel="name" itemValue="id"/>
					</form:select>
				</p>
				</div>
	<div class="splitcontentright tabular">
		<p>
			<label>Status</label>
			<form:select cssClass="uiDropdown" path="propertiesMap['status'].value">
				<form:option value=""></form:option>
				<form:options items="${status }" itemLabel="name" itemValue="id"/>
			</form:select>
		</p>
		<p>
			<label>Kraal</label>
			<form:select cssClass="uiDropdown" path="propertiesMap['kraal'].value">
				<form:option value=""></form:option>
				<form:options items="${kraals }" itemLabel="name" itemValue="id"/>
			</form:select>
		</p>
		<p style="display: none;" >
			<label>Date of Birth</label>
			<form:input path="propertiesMap['dateOfBirth'].value" cssClass="uiTextbox uiDateTextbox" id="txtDateofbirth"/>
		</p>
		<p>
			<label>Weight</label>
			<form:input path="propertiesMap['weight'].value" cssClass="uiTextbox"/>
		</p>
		</div>
		<p class="tabular" style="clear: both;">
		<input id="filter" type="submit" value="Search" name="btnFilter" class="uiButton"/>
		<input id="export" type="submit" value="Export"  name="btnFilter" class="uiButton"/>
	</p>
	</div>
	</fieldset>
	</form:form>
</div>

<div id="farmRecords" style="min-height: 400px;">
		<c:if test="${not empty kraal }">
			<input type="hidden" name="hdnFarmId" id="hdnFarmId" value="${kraal.id }"/>
		</c:if>
			<table class="recordTable" width="100%" cellpadding="0" cellspacing="0">
				<thead>
					<tr>
						<th>Name</th>
						<th>Ear Tag</th>
						<th>Type</th>
						<th>Health Status</th>
						<th>Color</th>
						<th>Breed</th>
						<th>Status</th>
						<th>Date of Birth</th>
						<th>Kraal</th>
						<th>Farm</th>
						<th>Manager</th>
					</tr>
				</thead>
				
				<tbody>	<c:choose>
						<c:when test="${not empty animals  && fn:length(animals) > 0}">
							<c:forEach var="animal" items="${animals}">
							
										<tr id="${animal.id }">
											<td>${animal.name}</td>
											<td>${animal.earTag}</td>
											<td>${animal.type.name }</td>
											<td>${animal.healthStatus.name }</td>
											<td>${animal.colour.name }</td>
											<td>${animal.breed.name }</td>
											<td>${animal.status.name }</td>
										    <td><fmt:formatDate value="${animal.dateOfBirth }" pattern="dd/MM/yyyy"/></td>	
										    <td>${animal.kraal.name }</td>	
										    <td>${animal.kraal.farm.name }</td>	
										    <td>${animal.kraal.farm.manager.firstName } . ${animal.kraal.farm.manager.lastName }</td>	
										</tr>
							</c:forEach>
						</c:when>
						</c:choose>
				</tbody>
			</table>
</div>